// START...
if (window.jQuery != undefined) { // If the user already has jQuery loaded on their site just start loading the widget
	loadWidget();
} else { // Load jQuery
	element = document.createElement('script');
	element.setAttribute('type', 'text/javascript');
	element.setAttribute('src', 'https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'); // jQuery from Google
	document.getElementsByTagName('head')[0].appendChild(element); // add jQuery to the head
	element.onload = loadWidget; // once jQuery has loaded, start loading the chemiphi widget
}

// Loads the widget on top of <a> tags with a class of 'widget_name'
function loadWidget() {
	jQuery(function($) {
		// Note: The 'widget_name' below will be automatically replaced with the propper class from the ruby widget_builder script
		$('a.widget_name').each(function(index, aTag) { // Creates a widget for every <a> tag with a class of widget_name 
			new CustomWidget(aTag);
		});
	});
}

// Custom Widget class that include the js code from the included js_path
function CustomWidget(aTag) {
	var widget = new Widget(aTag); // Create an instance of the widget object
	var w = widget.app; // 'w' is just a shortcut for the whole widget.app jQuery object
	JAVASCRIPT_PLACEHOLDER // The rest of the javascript is then included
}

// The main Widget class.
function Widget(aTag) {
	this.id = aTag.className + '_' + Math.round(Math.random()*10000); // generate a random number as the id of the widget
	this.aTag = aTag;
	this.dataset = $(aTag).data();
	this.app = $('<div>HTML&CSS_PLACEHOLDER</div>').attr('id', this.id);
	$(aTag).replaceWith(this.app); // Replace the <a> tag placeholder with the widget HTML

	// Destroys the widget if the referring link has been altered. This functions needs to be called to take effect
	this.validateReference = function validateReference() {
		var a = $(aTag);
		if (a.attr('href') != 'HREF_PLACEHOLDER' || a.attr('rel')  == 'nofollow') {
			this.app.remove();
			delete this;
			// Displays a console error alerting of the situation
			console.error('The Widget widget_name was not loaded due to an invalid <a> tag reference.\nA valid tag would be: VALID_ATAG_PLACEHOLDER')
		}
	}
}

// Utility function that sets the CSS of elements to defaults if they are not already set
function resetCSS(element, andChildren) {
	// if andChildren is true, reset the styles of the specified jQuery object and all its children
	var elements = andChildren ? element.find('*').andSelf() : element;
	elements.each( function() {
		var defaultStyles = {
			'margin-top':       '0px',
			'margin-bottom':    '0px',
			'margin-left':      '0px',
			'margin-right':     '0px',
			'padding-top':      '0px',
			'padding-bottom':   '0px',
			'padding-left':     '0px',
			'padding-right':    '0px',
			'font-size':        'normal',
			'font-style':       'normal',
			'font-variant':     'normal',
			'font-weight':      'normal',
			'line-height':      'normal',
			'vertical-align':   'baseline',
			'color':            'black',
			'background-color': 'transparent'
		}; // Need to reset borders, fonts etc.
		for (var key in defaultStyles) {
			if (!this.style[key])
				this.style[key] = defaultStyles[key];
		}
	});
	return element // return the jQuery object back for possible chaining
}

